<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <style>
    .red {
      background-color: red;
      height: 160px;
      width: 160px;
    }
    .orange {
      background-color: orange;
    }
    .yellow {
      background-color: yellow;
    }
    .green {
      background-color: green;
      height: 160px;
      width: 160px;
    }
    .green a {
      color: purple;
      line-height: 50px;
    }
    </style>
    <link href="css/style.css" rel="stylesheet">
  </head>
  <body>
    <div class="red">
      <a class="orange" href="#">this is archor archor</a>
      <br>
      <a class="yellow" href="#">this is archor archor</a>
    </div>
  
    <div class="green">
      <a class="orange" href="#">this is archor</a>
      <br>
      <a class="yellow" href="#">this is archor</a>
    </div>
    给行内元素设置line-height可以改变其垂直方向位置
  </body>
</html>
